<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">

<head>

    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

    <!-- Sweet alert -->
    <link href="../css/plugins/sweetalert/sweetalert.css" rel="stylesheet"/>

    <title>发送通知</title>

    <link rel="shortcut icon" href="../static/favicon.ico"/>
    <link href="../css/bootstrap.min.css?v=3.3.6" rel="stylesheet"/>
    <link href="../css/font-awesome.css?v=4.4.0" rel="stylesheet"/>
    <link href="../plugin/layui/css/layui.css" rel="stylesheet"/>
    <link href="../css/animate.css" rel="stylesheet"/>
    <link href="../css/style.css?v=4.1.0" rel="stylesheet"/>

    <script src="../js/plugins/sweetalert/sweetalert.min.js"></script>
    <script th:src="@{/static/plugin/jquery/jquery-3.2.1.js}"></script>
    <script th:src="@{/static/plugin/layui/layui.js}"></script>
    <script th:src="@{/static/js/plugins/wangEditor.min.js}"></script>
    <script th:src="@{/static/js/lin/notice.js}"></script>

    <style>
        /* Additional style to fix warning dialog position */
        #alertmod_table_list_2 {
            top: 900px !important;
        }

        #upload {
            margin-left: 200px !important;
        }
        .form-group{
            margin: 15px;
        }
    </style>

</head>

<body class="gray-bg">


<div id="loading" style="text-align: center;display: none">
    <img alt="alt" th:src="@{../img/loading.gif}"/>
</div>


<!-- 主体 -->

<br/>
<br/>


<div class="col-md-8">
    <form id="noticform" action="">

        <div class="form-group">
            <label class="col-sm-2 control-label">消息类型：</label>
            <div class="col-sm-10">
                <select id="messagetype" class="form-control" name="message">
                    <option value="0">系统消息</option>
                </select>
            </div>
        </div>

        <div class="form-group">
            <label class="col-sm-2 control-label">消息标题：</label>
            <div class="col-sm-10">
                <input type="text" name="title" class="form-control"/>
            </div>

        </div>
        <!--  	<div id="treeview" class="form-group">
                    <label class="col-sm-3 control-label">接受者：</label>
                    <div class="col-sm-9">
                        <div class="easyui-panel" style="padding:5px">
                            <ul id="tt" class="easyui-tree"
                                data-options="url:'/noticetreedata',method:'get',animate:true,checkbox:true"></ul>
                        </div>
                        <br /> <br />
                    </div>
                </div>        -->


        <div class="form-group">
            <label class="col-sm-2 control-label">通知内容：</label>
            <input type="hidden" id="body" name="body"/>
            <div class="col-sm-10">
                <div id="content"></div>
            </div>
        </div>
        <div class="form-group">
            <div class="layui-upload upload">
                <button type="button" class="layui-btn" id="upload">
                    <i class="layui-icon">&#xe67c;</i>添加附件
                </button>
            </div>
        </div>
        <div class="col-sm-9 col-sm-offset-3">
            <button class="btn btn-primary btn-block" type="button" id="addNotice">发送通知</button>
        </div>
    </form>


</div>


<!-- 全局js -->

<!--<script src="../js/bootstrap.min.js?v=3.3.6"></script>-->


<!-- Peity -->
<script src="../js/plugins/peity/jquery.peity.min.js"></script>
<script type="text/javascript">
    const OK = 200;
    var file = {noticeId: 0};
    var noticeId = 0;
    function addNotice() {
        var data = $("#noticform").serialize();
        console.log("add...");
        $.ajax({
            url: "/notice/add.json",
            data: data,
            type: "POST",
            success: function (data) {
                if (data.code === OK) {
                    file.noticeId = data.data;
                    console.log(file.noticeId);
                }

            }
        });
    }
    function getFileName(filePath) {
        var fileName = null;
        if (filePath !== null) {
            if (filePath.indexOf('_') != -1) {
                fileName = filePath.substring(filePath.lastIndexOf('_') + 1);
            }
        }
        return fileName;
    }
    function addFile() {
        file.fileName = getFileName(file.filePath);
//        file.noticeId = noticeId;
        var data = file;
        console.log("add..." + file);
        $.ajax({
            url: "/file/add.json",
            data: data,
            type: "POST",
            success: function (data) {
                console.log(data);
                swal({
                    "title": "操作成功！",
                    "text": "发送通知成功",
                    "type": "success"
                })
            }
        });
    }
    function upload() {
        layui.use('upload', function () {
            var upload = layui.upload;

            //执行实例
            var uploadInst = upload.render({
                elem: '#upload' //绑定元素
                , accept: "file"
                , auto: false //选择文件后不自动上传
                , bindAction: '#addNotice' //指向一个按钮触发上传
                , url: '/files/upload/' //上传接口
                , done: function (data) {
                    //上传完毕回调
                    console.log(data);
                    if (data.code === OK) {
                        file.filePath = data.data;
                        swal({
                            "title": "操作成功！",
                            "text": "上传文件成功",
                            "type": "success"
                        })
                    }

                    setTimeout(function () {
                        console.log(file);
                        addFile();
                    }, 1500);

                }
                , error: function () {
                    //请求异常回调
                }
            });
        });
    }


    $(function () {
        var E = window.wangEditor;
        var editor = new E('#content');
        var $body = $('#body');
        editor.customConfig.onchange = function (html) {
            // 监控变化，同步更新到 textarea
            $body.val(html)
        };
        editor.create();
        // 初始化 textarea 的值
        $body.val(editor.txt.html());

        upload();
        $("#addNotice").click(function () {
            addNotice();

        });
    });

</script>


</body>

</html>
